<style lang="sass" scoped>
	.shade {
		display: none;
	}
	
	.lite {
		position: fixed;
		left: 50%;
		margin-left: -25%;
		bottom: 18%;
		width: 50%;
		background-color: rgba(0, 0, 0, 0.7);
		line-height: 1.8rem;
		padding: 0.5rem 0.6rem;
		color: #fff;
		border-radius: 0.5rem;
		text-align: center;
		font-size: 1.2rem;
		word-break: break-all;
		z-index: 30;
	}
	.tips-transition {
		-webkit-transition: all .4s;
	}
	.tips-enter {
		-webkit-transform: scale3d(.8, .8, 1);
		opacity: 0;
	}
	.tips-leave {
		-webkit-transform: scale3d(1.2, 1.2, 1);
		opacity: 0;
	}
</style>

<template>	
	<div class="shade"></div>
	<div class="lite" v-if="getTipsConfig.show" transition="tips">{{getTipsConfig.content}}</div>
</template>

<script>
	console.log("tips loaded!");
	/*
	 配置参数
	 show: tips显示开关
	 shadeClose: 是否可点击遮罩层关闭,
	 content: 提示内容,
	 closeTimeout: 自动关闭时间,不填写则默认1.5秒后关闭, 0为不自动关闭
	 * */
	var HQ_Actions = require("HQ_Actions").tips,
		HQ_Getters = require("HQ_Getters").tips;
	module.exports = {
		props: ['content', "shadeClose"],
		ready: function() {
			console.log(HQ_Actions)
		},
		data: function() {
			return {
			}
		},
		computed: {},
		methods: {},
		vuex: {
			actions: HQ_Actions,
			getters: HQ_Getters
		},
		beforeDestroy: function() {}
	}

</script>